<!doctype html>
<html>
 <head> 
  <meta charset="utf-8"> 
  <title>layui 第三方组件平台</title> 
  <meta name="renderer" content="webkit"> 
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> 
  <meta name="keywords" content="layui插件,layui组件,layui扩展"> 
  <meta name="description" content="layui 扩展组件平台用于收集来自 layui 官方以外的组件，由开发者自己维护。平台的目的是为了释放 layui 官方原创组件的压力，将更具想象力的组件生态开放给社区，让那些有能力有兴趣的开发者也能参与进来，共同完善 layui！"> 
  <link rel="stylesheet" href="/t/font_24081_60slu02pimt.css">
  <link rel="stylesheet" href="/layui/dist/css/layui.css">
  <link rel="stylesheet" href="/static/css/fly/global.css" charset="utf-8">
  <link rel="stylesheet" href="/static/css/global.css" charset="utf-8">

 </head>
 <body>
  <div class="layui-header header header-extends" style="background-color: #24262F;"> 
   <div class="layui-container"> <a class="logo" href="https://layui.itmtr.cn/"> <img src="/static/images/layui/logo.png" alt="layui"> </a> 
    <div class="layui-form component" lay-filter="LAY-site-header-component"></div> 
    <ul class="layui-nav"> 
     <li class="layui-nav-item layui-hide-xs"> <a href="//layui.itmtr.cn/">框架</a> </li> 
     <li class="layui-nav-item layui-hide-xs layui-this"> <a href="/extend/index.html">扩展</a> </li> 
     <li class="layui-nav-item"> <a href="javascript:;">周边</a> 
      <dl class="layui-nav-child layui-nav-child-c"> 
       <dd lay-unselect> <a href="//layui.itmtr.cn/alone.html" target="_blank">独立组件</a> 
       </dd> 
       <dd class="layui-hide-sm layui-show-xs" lay-unselect> <a href="/extend/index.html">扩展组件</a> 
        <hr> 
       </dd> 
      </dl> </li> 
    </ul> 
   </div>
  </div><!--[if lt IE 9]>  <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>  <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script><![endif]--> 
  <div class="fly-extend-banner"> 
   <h1 class="fly-extend-banner-title">layui 第三方组件平台</h1> 
   <!--<form action="/extend/search/" class="fly-extend-banner-search">
    <div class="layui-inline">
     <input placeholder="搜索 layui 第三方组件" name="kws" autocomplete="off" value="" class="layui-input">
    </div><button class="layui-btn"><i class="layui-icon layui-icon-search"></i></button>
   </form>-->
   <div class="fly-extend-banner-release"> <a href="/extend/index.html" class="layui-btn layui-btn-lg">返回首页</a>
   </div> 
  </div>
  <div class="layui-container"> 
   <div class="layui-tab layui-tab-brief fly-extend-tabs"> 
    <ul class="layui-tab-title"> 
     <li> <a href="/extend/index.html">按最新</a> </li> 
     <li class="layui-this"> <a href="/extend/order/hot/index.html">按人气</a> </li> 
    </ul> 
   </div> 
   <ul class="layui-row layui-col-space30"> 
    <li class="layui-col-sm12 layui-col-md6"> 
     <div class="fly-extend-list layui-card"> 
      <div class="fly-extend-list-header"> 
       <h2 class="fly-extend-title layui-elip"> <a href="/extend/bioarea/index.html"> bioarea 省市区三级联动 </a> 
        <div class="layui-badge layui-bg-green layui-hide-xs">
          bioarea 
        </div> </h2> 
       <div class="fly-extend-list-info"> <a href1="/u/67884264/" target="_blank" class="fly-extend-list-user"> <cite class="layui-hide-xs">奋斗**伟</cite> <img src="/images/fly/avatar/6.jpg" alt="奋斗**伟"> </a> 
       </div> 
      </div> <a href="/extend/bioarea/index.html" target="_blank"> 
       <div class="fly-extend-list-desc">
        <p>省市区三级联动改良版，拿到的是省市区的code码，可以赋值,用法自己有介绍</p>
       </div> </a> 
     </div> </li> 
    <li class="layui-col-sm12 layui-col-md6"> 
     <div class="fly-extend-list layui-card"> 
      <div class="fly-extend-list-header"> 
       <h2 class="fly-extend-title layui-elip"> <a href="/extend/qiniuyun/index.html"> 七牛云上传组件（支持分片） </a> 
        <div class="layui-badge layui-bg-green layui-hide-xs">
          qiniuyun 
        </div> </h2> 
       <div class="fly-extend-list-info"> <a href1="/u/15348816/" target="_blank" class="fly-extend-list-user"> <cite class="layui-hide-xs">还俗**兄</cite> <img src="/qqapp/101235792/5FF2C332CA03FC3E3FA396D19A339361/100" alt="还俗**兄"> </a> 
       </div> 
      </div> <a href="/extend/qiniuyun/index.html" target="_blank"> 
       <div class="fly-extend-list-desc">
        <p>使用七牛云官方文档编辑上传，支持分片上传，后台只需提供token、domain即可。</p>
       </div> </a> 
     </div> </li> 
    <li class="layui-col-sm12 layui-col-md6"> 
     <div class="fly-extend-list layui-card"> 
      <div class="fly-extend-list-header"> 
       <h2 class="fly-extend-title layui-elip"> <a href="/extend/dropMenu/index.html"> dropMenu下拉菜单组件 </a> 
        <div class="layui-badge layui-bg-green layui-hide-xs">
          dropMenu 
        </div> </h2> 
       <div class="fly-extend-list-info"> <a href1="/u/45030216/" target="_blank" class="fly-extend-list-user"> <cite class="layui-hide-xs">Je**8</cite> <img src="/g" alt="Je**8"> </a> 
       </div> 
      </div> <a href="/extend/dropMenu/index.html" target="_blank"> 
       <div class="fly-extend-list-desc">
        <p>基于LayUI的下拉菜单组件，可以和layui.table组合使用</p>
       </div> </a> 
     </div> </li> 
    <li class="layui-col-sm12 layui-col-md6"> 
     <div class="fly-extend-list layui-card"> 
      <div class="fly-extend-list-header"> 
       <h2 class="fly-extend-title layui-elip"> <a href="/extend/layrouter/index.html"> layrouter 前端路由模块 </a> 
        <div class="layui-badge layui-bg-green layui-hide-xs">
          layrouter 
        </div> </h2> 
       <div class="fly-extend-list-info"> <a href1="/u/6027000/" target="_blank" class="fly-extend-list-user"> <cite class="layui-hide-xs">ta**s</cite> <img src="/images/fly/avatar/10.jpg" alt="ta**s"> </a> 
       </div> 
      </div> <a href="/extend/layrouter/index.html" target="_blank"> 
       <div class="fly-extend-list-desc">
        <p>layrouter 基于 layui 的前端路由模块</p>
       </div> </a> 
     </div> </li> 
    <li class="layui-col-sm12 layui-col-md6"> 
     <div class="fly-extend-list layui-card"> 
      <div class="fly-extend-list-header"> 
       <h2 class="fly-extend-title layui-elip"> <a href="/extend/customSelect/index.html"> customSelect 树形下拉选择 </a> 
        <div class="layui-badge layui-bg-green layui-hide-xs">
          customSelect 
        </div> </h2> 
       <div class="fly-extend-list-info"> <a href1="/u/73157112/" target="_blank" class="fly-extend-list-user"> <cite class="layui-hide-xs">fl**7</cite> <img src="/g" alt="fl**7"> </a> 
       </div> 
      </div> <a href="/extend/customSelect/index.html" target="_blank"> 
       <div class="fly-extend-list-desc">
        <p>基于 layui.tree 的树形下拉选择组件，支持单选和多选</p>
       </div> </a> 
     </div> </li> 
    <li class="layui-col-sm12 layui-col-md6"> 
     <div class="fly-extend-list layui-card"> 
      <div class="fly-extend-list-header"> 
       <h2 class="fly-extend-title layui-elip"> <a href="/extend/strpy/index.html"> strpy汉字转拼音 </a> 
        <div class="layui-badge layui-bg-green layui-hide-xs">
          strpy 
        </div> </h2> 
       <div class="fly-extend-list-info"> <a href1="/u/12829656/" target="_blank" class="fly-extend-list-user"> <cite class="layui-hide-xs">快乐**生</cite> <img src="/images/fly/avatar/9.jpg" alt="快乐**生"> </a> 
       </div> 
      </div> <a href="/extend/strpy/index.html" target="_blank"> 
       <div class="fly-extend-list-desc">
        <p>str 要转为拼音的汉字 separa 分隔符号，默认为空格 percase 1=每个汉字首个英文大写，2=全部大写，默认为全小写</p>
       </div> </a> 
     </div> </li> 
    <li class="layui-col-sm12 layui-col-md6"> 
     <div class="fly-extend-list layui-card"> 
      <div class="fly-extend-list-header"> 
       <h2 class="fly-extend-title layui-elip"> <a href="/extend/timeago/index.html"> timeago：转换时间为"xx时间前" </a> 
        <div class="layui-badge layui-bg-green layui-hide-xs">
          timeago 
        </div> </h2> 
       <div class="fly-extend-list-info"> <a href1="/u/3200064/" target="_blank" class="fly-extend-list-user"> <cite class="layui-hide-xs">无求**丶</cite> <img src="/avatar/3200064.png" alt="无求**丶"> </a> 
       </div> 
      </div> <a href="/extend/timeago/index.html" target="_blank"> 
       <div class="fly-extend-list-desc">
        <p>timeago.js 是一个非常简洁、轻量级、不到 1kb 的很简洁的 Javascript 库，用来将 datetime 时间转化成类似于*** 时间前的描述字符串，例如：“3 小时前”。</p>
       </div> </a> 
     </div> </li> 
    <li class="layui-col-sm12 layui-col-md6"> 
     <div class="fly-extend-list layui-card"> 
      <div class="fly-extend-list-header"> 
       <h2 class="fly-extend-title layui-elip"> <a href="/extend/hashes/index.html"> hashes 哈希加密组件 </a> 
        <div class="layui-badge layui-bg-green layui-hide-xs">
          hashes 
        </div> </h2> 
       <div class="fly-extend-list-info"> <a href1="/u/2347968/" target="_blank" class="fly-extend-list-user"> <cite class="layui-hide-xs">le**a</cite> <img src="/qqapp/101235792/71FB2C67FBF06CAE01D46F4258BA3CF1/100" alt="le**a"> </a> 
       </div> 
      </div> <a href="/extend/hashes/index.html" target="_blank"> 
       <div class="fly-extend-list-desc">
        <p>hashes是一个轻量级的库，在纯JavaScript（符合ES5）中实现最扩展的加密哈希函数算法。</p>
       </div> </a> 
     </div> </li> 
    <li class="layui-col-sm12 layui-col-md6"> 
     <div class="fly-extend-list layui-card"> 
      <div class="fly-extend-list-header"> 
       <h2 class="fly-extend-title layui-elip"> <a href="/extend/rc_cascader/index.html"> 级联选择器 </a> 
        <div class="layui-badge layui-bg-green layui-hide-xs">
          rc_cascader 
        </div> </h2> 
       <div class="fly-extend-list-info"> <a href1="/u/6194664/" target="_blank" class="fly-extend-list-user"> <cite class="layui-hide-xs">Ri**n</cite> <img src="/qqapp/101235792/3388DFDB3633BEBC93B536DCA681FB97/100" alt="Ri**n"> </a> 
       </div> 
      </div> <a href="/extend/rc_cascader/index.html" target="_blank"> 
       <div class="fly-extend-list-desc">
        <p>仿 ElementUI 的 Cascader 级联选择器</p>
       </div> </a> 
     </div> </li> 
    <li class="layui-col-sm12 layui-col-md6"> 
     <div class="fly-extend-list layui-card"> 
      <div class="fly-extend-list-header"> 
       <h2 class="fly-extend-title layui-elip"> <a href="/extend/cron/index.html"> cron 表达式组件 </a> 
        <div class="layui-badge layui-bg-green layui-hide-xs">
          cron 
        </div> </h2> 
       <div class="fly-extend-list-info"> <a href1="/u/16386048/" target="_blank" class="fly-extend-list-user"> <cite class="layui-hide-xs">你最**哥</cite> <img src="/avatar/16386048.jpg" alt="你最**哥"> </a> 
       </div> 
      </div> <a href="/extend/cron/index.html" target="_blank"> 
       <div class="fly-extend-list-desc">
        <p>Cron 表达式生成器2.0</p>
       </div> </a> 
     </div> </li> 
    <li class="layui-col-sm12 layui-col-md6"> 
     <div class="fly-extend-list layui-card"> 
      <div class="fly-extend-list-header"> 
       <h2 class="fly-extend-title layui-elip"> <a href="/extend/location/index.html"> location 地图区域定位 </a> 
        <div class="layui-badge layui-bg-green layui-hide-xs">
          location 
        </div> </h2> 
       <div class="fly-extend-list-info"> <a href1="/u/65266824/" target="_blank" class="fly-extend-list-user"> <cite class="layui-hide-xs">Ha**u</cite> <img src="/images/fly/avatar/7.jpg" alt="Ha**u"> </a> 
       </div> 
      </div> <a href="/extend/location/index.html" target="_blank"> 
       <div class="fly-extend-list-desc">
        <p>用于地图定位</p>
       </div> </a> 
     </div> </li> 
    <li class="layui-col-sm12 layui-col-md6"> 
     <div class="fly-extend-list layui-card"> 
      <div class="fly-extend-list-header"> 
       <h2 class="fly-extend-title layui-elip"> <a href="/extend/ctyun/index.html"> 天翼云上传组件（支持分片） </a> 
        <div class="layui-badge layui-bg-green layui-hide-xs">
          ctyun 
        </div> </h2> 
       <div class="fly-extend-list-info"> <a href1="/u/15348816/" target="_blank" class="fly-extend-list-user"> <cite class="layui-hide-xs">还俗**兄</cite> <img src="/qqapp/101235792/5FF2C332CA03FC3E3FA396D19A339361/100" alt="还俗**兄"> </a> 
       </div> 
      </div> <a href="/extend/ctyun/index.html" target="_blank"> 
       <div class="fly-extend-list-desc">
        <p>使用plupload插件，调用天翼云官方SDK实现分片上传。</p>
       </div> </a> 
     </div> </li> 
    <li class="layui-col-sm12 layui-col-md6"> 
     <div class="fly-extend-list layui-card"> 
      <div class="fly-extend-list-header"> 
       <h2 class="fly-extend-title layui-elip"> <a href="/extend/iconExtend/index.html"> layui扩展图标库（自定义） </a> 
        <div class="layui-badge layui-bg-green layui-hide-xs">
          iconExtend 
        </div> </h2> 
       <div class="fly-extend-list-info"> <a href1="/u/1769376/" target="_blank" class="fly-extend-list-user"> <cite class="layui-hide-xs">Hi**y</cite> <img src="/qqapp/101235792/78400E63216B18C28EFEEC5A7013BA3E/100" alt="Hi**y"> </a> 
       </div> 
      </div> <a href="/extend/iconExtend/index.html" target="_blank"> 
       <div class="fly-extend-list-desc">
        <p>layui-iconExtend是基于layui的一款扩展插件，可以通过此插件可以对layui图标进行扩展，并提供基础图标操作方法。</p>
       </div> </a> 
     </div> </li> 
    <li class="layui-col-sm12 layui-col-md6"> 
     <div class="fly-extend-list layui-card"> 
      <div class="fly-extend-list-header"> 
       <h2 class="fly-extend-title layui-elip"> <a href="/extend/labeledit/index.html"> labeledit 标签编辑组件 </a> 
        <div class="layui-badge layui-bg-green layui-hide-xs">
          labeledit 
        </div> </h2> 
       <div class="fly-extend-list-info"> <a href1="/u/68027064/" target="_blank" class="fly-extend-list-user"> <cite class="layui-hide-xs">王洪**刚</cite> <img src="/images/fly/avatar/1.jpg" alt="王洪**刚"> </a> 
       </div> 
      </div> <a href="/extend/labeledit/index.html" target="_blank"> 
       <div class="fly-extend-list-desc">
        <p>labeledit 是一个文本显示与编辑功能切换的组件，组件基于layui实现，编辑类型可以是文本 单选框 下拉选择框 勾选框 日期选择 时分选择 颜色选择。</p>
       </div> </a> 
     </div> </li> 
    <li class="layui-col-sm12 layui-col-md6"> 
     <div class="fly-extend-list layui-card"> 
      <div class="fly-extend-list-header"> 
       <h2 class="fly-extend-title layui-elip"> <a href="/extend/dragMove/index.html"> dragMove 图片放大拖拽查看 </a> 
        <div class="layui-badge layui-bg-green layui-hide-xs">
          dragMove 
        </div> </h2> 
       <div class="fly-extend-list-info"> <a href1="/u/37326744/" target="_blank" class="fly-extend-list-user"> <cite class="layui-hide-xs">ba**e</cite> <img src="/avatar/37326744.png" alt="ba**e"> </a> 
       </div> 
      </div> <a href="/extend/dragMove/index.html" target="_blank"> 
       <div class="fly-extend-list-desc">
        <p>仿windows图片查看器，弹窗模式查看图片，支持图片拖拽和滚轮缩放。</p>
       </div> </a> 
     </div> </li> 
    <li class="layui-col-sm12 layui-col-md6"> 
     <div class="fly-extend-list layui-card"> 
      <div class="fly-extend-list-header"> 
       <h2 class="fly-extend-title layui-elip"> <a href="/extend/drawer/index.html"> drawer 抽屉组件 </a> 
        <div class="layui-badge layui-bg-green layui-hide-xs">
          drawer 
        </div> </h2> 
       <div class="fly-extend-list-info"> <a href1="/u/45030216/" target="_blank" class="fly-extend-list-user"> <cite class="layui-hide-xs">Je**8</cite> <img src="/g" alt="Je**8"> </a> 
       </div> 
      </div> <a href="/extend/drawer/index.html" target="_blank"> 
       <div class="fly-extend-list-desc">
        <p>侧边栏抽屉功能</p>
       </div> </a> 
     </div> </li> 
    <li class="layui-col-sm12 layui-col-md6"> 
     <div class="fly-extend-list layui-card"> 
      <div class="fly-extend-list-header"> 
       <h2 class="fly-extend-title layui-elip"> <a href="/extend/layDrawer/index.html"> layDrawer 抽屉效果 </a> 
        <div class="layui-badge layui-bg-green layui-hide-xs">
          layDrawer 
        </div> </h2> 
       <div class="fly-extend-list-info"> <a href1="/u/33855192/" target="_blank" class="fly-extend-list-user"> <cite class="layui-hide-xs">Re**l</cite> <img src="/qqapp/101235792/7B6FAE44A5478551B1BC72D4939B73FD/100" alt="Re**l"> </a> 
       </div> 
      </div> <a href="/extend/layDrawer/index.html" target="_blank"> 
       <div class="fly-extend-list-desc">
        <p>简易的上下左右抽屉效果</p>
       </div> </a> 
     </div> </li> 
    <li class="layui-col-sm12 layui-col-md6"> 
     <div class="fly-extend-list layui-card"> 
      <div class="fly-extend-list-header"> 
       <h2 class="fly-extend-title layui-elip"> <a href="/extend/WordExport_yx/index.html"> Word 导出 </a> 
        <div class="layui-badge layui-bg-green layui-hide-xs">
          WordExport_yx 
        </div> </h2> 
       <div class="fly-extend-list-info"> <a href1="/u/41304312/" target="_blank" class="fly-extend-list-user"> <cite class="layui-hide-xs">武动**坤</cite> <img src="/images/fly/avatar/10.jpg" alt="武动**坤"> </a> 
       </div> 
      </div> <a href="/extend/WordExport_yx/index.html" target="_blank"> 
       <div class="fly-extend-list-desc">
        <p>补充了 word 导出和 layui 结合使用的缺口，可以做简单的导出</p>
       </div> </a> 
     </div> </li> 
    <li class="layui-col-sm12 layui-col-md6"> 
     <div class="fly-extend-list layui-card"> 
      <div class="fly-extend-list-header"> 
       <h2 class="fly-extend-title layui-elip"> <a href="/extend/pinyin/index.html"> pinyin 汉字转拼音组件 </a> 
        <div class="layui-badge layui-bg-green layui-hide-xs">
          pinyin 
        </div> </h2> 
       <div class="fly-extend-list-info"> <a href1="/u/18794328/" target="_blank" class="fly-extend-list-user"> <cite class="layui-hide-xs">小迷**虫</cite> <img src="/images/fly/avatar/0.jpg" alt="小迷**虫"> </a> 
       </div> 
      </div> <a href="/extend/pinyin/index.html" target="_blank"> 
       <div class="fly-extend-list-desc">
        <p>整合 pinyin.js 和 initials.js，汉字转拼音，提取首字母</p>
       </div> </a> 
     </div> </li> 
    <li class="layui-col-sm12 layui-col-md6"> 
     <div class="fly-extend-list layui-card"> 
      <div class="fly-extend-list-header"> 
       <h2 class="fly-extend-title layui-elip"> <a href="/extend/formDesigner/index.html"> 基于 layui 的表单设计器 </a> 
        <div class="layui-badge layui-bg-green layui-hide-xs">
          formDesigner 
        </div> </h2> 
       <div class="fly-extend-list-info"> <a href1="/u/32565288/" target="_blank" class="fly-extend-list-user"> <cite class="layui-hide-xs">fl**7</cite> <img src="/qqapp/101235792/F1E87B78406AB59E81F217446989AC70/100" alt="fl**7"> </a> 
       </div> 
      </div> <a href="/extend/formDesigner/index.html" target="_blank"> 
       <div class="fly-extend-list-desc">
        <p>本项目是一个基于layui表单组件的表单设计器 1.本项目基于Layui、Jquery、Sortable 2.项目已经基本实现了拖动布局，父子布局 3.项目实现了大部分基于Layui的Form表单控件布局，包括输入框、编辑器、下拉、单选、单选组、多选组、日期、滑块、评分、轮播、图片、颜色选择、图片上传、文件上传</p>
       </div> </a> 
     </div> </li> 
   </ul> 
   <div style="padding: 30px 0;"> 
    <div style="text-align: center;"> 
     <div class="laypage-main">
      <a href="/extend/order/hot/page/4/index.html" class="laypage-prev">上一页</a><a href="/extend/order/hot/page/1/index.html" class="laypage-first" title="首页">首页</a><span>…</span><a href="/extend/order/hot/page/3/index.html">3</a><a href="/extend/order/hot/page/4/index.html">4</a><span class="laypage-curr">5</span><a href="/extend/order/hot/page/6/index.html">6</a><a href="/extend/order/hot/page/7/index.html">7</a><a href="/extend/order/hot/page/6/index.html" class="laypage-next">下一页</a>
     </div> 
    </div> 
   </div>
  </div>
  <div class="fly-footer"> 
   <p>Copyright © 2021 <a href="/index.html">layui.itmtr.cn</a> MIT Licensed</p>
  </div>
  <script src="/layui/dist/layui.js"></script>
  <script>// common</script>

 </body>
<script src="/common/common.js"></script>
</html>